{% extends 'base.html' %}
{% block title %}配置{% endblock %}
{% block css %}

    <!-- Theme style -->

    <!-- AdminLTE Skins. Choose a skin from the css/skins
         folder instead of downloading all of them to reduce the load. -->

    <link rel="stylesheet" href="../static/plugins/messenger/messenger-theme-future.css">
    <link rel="stylesheet" href="../static/plugins/messenger/messenger.css">
    <link rel="stylesheet" href="../static/plugins/bootstrap-switch/bootstrap-switch.min.css"
          rel="stylesheet">
{% endblock %}

{% block content %}

    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>
            配置
        </h1>
        <ol class="breadcrumb">
            <li><a href="/"><i class="fa fa-dashboard"></i> 主页</a></li>
            <li class="active">配置</li>
        </ol>
    </section>

    <!-- Main content -->


    <section class="content">


        <div class="row">
            <div class="col-md-7">
                <div class="box box-danger">

                    <!-- /.box-header -->
                    <form class="form-horizontal " id="setting_form" action="/setting" method='POST'>

                        <div class="box-body">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">扫描并发数</label>

                                <div class="col-sm-6">
                                    <input type="text" name="scanning_num" class="form-control" placeholder="每个节点的扫描并发数"
                                           value="{{ setting_data['scanning_num'] }}"
                                    >
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">发送结果</label>

                                <div class="col-sm-6">
                                    {% if setting_data["mail_enable"]=="on" %}

                                        <input style="margin-right: 5px;" name="mail_enable" type="checkbox" checked>
                                    {% else %}
                                        <input style="margin-right: 5px;" name="mail_enable" type="checkbox">
                                    {% endif %}
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">发送方式</label>

                                <div class="col-sm-6">

                                    {% if setting_data["mail_enable"]=="on" %}
                                        <select name="send_type" class="form-control email_info">
                                            {% if setting_data['send_type']=='always' %}
                                                <option value="always" selected>每次扫描完毕都发送邮件</option>
                                                <option value="change">只有出现端口变化或监控端口开放时发送</option>
                                            {% elif setting_data['send_type']=='change' %}
                                                <option value="always">每次扫描完毕都发送邮件</option>
                                                <option value="change" selected>只有出现端口变化或监控端口开放时发送</option>
                                            {% endif %}

                                        </select>


                                    {% else %}

                                        <select name="send_type" class="form-control email_info" disabled="disabled">
                                            {% if setting_data['send_type']=='always' %}
                                                <option value="always" selected>每次扫描完毕都发送邮件</option>
                                                <option value="change">只有出现端口变化或监控端口开放时发送</option>
                                            {% elif setting_data['send_type']=='change' %}
                                                <option value="always">每次扫描完毕都发送邮件</option>
                                                <option value="change" selected>只有出现端口变化或监控端口开放时发送</option>
                                            {% else %}
                                                <option value="always">每次扫描完毕都发送邮件</option>
                                                <option value="change">只有出现端口变化或监控端口开放时发送</option>
                                            {% endif %}
                                        </select>

                                    {% endif %}


                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">邮件服务器</label>

                                <div class="col-sm-6">
                                    {% if setting_data["mail_enable"]=="on" %}
                                        <input type="text" name="email_server" class="form-control email_info"
                                               placeholder="smtp.139.com" value="{{ setting_data['email_server'] }}">
                                    {% else %}
                                        <input type="text" name="email_server" class="form-control email_info"
                                               placeholder="smtp.139.com" disabled="disabled">
                                    {% endif %}
                                </div>
                            </div>

                            <div class="form-group ">
                                <label class="col-sm-2 control-label">发件人邮箱</label>
                                <div class="col-sm-6">
                                    {% if setting_data["mail_enable"]=="on" %}
                                        <input name="sender" type="text" class="form-control email_info"
                                               placeholder="zhangsan@139.com" value="{{ setting_data['sender'] }}">
                                    {% else %}
                                        <input name="sender" type="text" class="form-control email_info"
                                               placeholder="zhangsan@139.com" disabled="disabled">
                                    {% endif %}
                                </div>

                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">发件人邮箱密码</label>

                                <div class="col-sm-6">
                                    {% if setting_data["mail_enable"]=="on" %}
                                        <input type="password" name="email_pwd" class="form-control email_info"
                                               placeholder="123456" value="{{ setting_data['email_pwd'] }}">
                                    {% else %}
                                        <input type="password" name="email_pwd" class="form-control email_info"
                                               placeholder="123456" disabled="disabled">
                                    {% endif %}
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">收件人</label>

                                <div class="col-sm-6">

                                    {% if setting_data["mail_enable"]=="on" %}
                                        <input type="text" name="email_address" class="form-control email_info"
                                               placeholder="多个收件人请用逗号分开，如：a@qq.com,b@163.com"
                                               value="{{ setting_data['email_address'] | list2str }} ">
                                    {% else %}
                                        <input type="text" name="email_address" class="form-control email_info"
                                               placeholder="多个收件人请用逗号分开，如：a@qq.com,b@163.com" disabled="disabled">
                                    {% endif %}


                                </div>
                            </div>

                        </div>
                        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
                        <!-- /.box-body -->
                        <div class=" box-footer">

                            <button type="submit" id="setting_submit" class="btn btn-info pull-right"
                                    style="float:left;margin-left:10px;">提交
                            </button>
                            {% if setting_data["mail_enable"]=="on" %}
                                <input name="test_email" type="button" id="test_email"
                                       class="btn btn-info pull-right email_info"
                                       value="发送测试邮件" onclick="send_email()"/>
                            {% else %}
                                <input name="test_email" type="button" id="test_email"
                                       class="btn btn-info pull-right email_info"
                                       value="发送测试邮件" onclick="send_email()" disabled="disabled"/>
                            {% endif %}

                        </div>

                        <!-- /.box-footer -->
                    </form>
                    <!-- /.box-body -->

                </div>
                <!-- /.box -->


            </div>
            <!-- /.col -->

            <!-- /.col -->
        </div>


        <!-- Default box -->

        <!-- /.box-body -->

    </section>





    <!-- /.content -->

{% endblock %}




{% block script %}
    {#    <script src="https://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>#}
    <script src="../static/plugins/bootstrap-switch/bootstrap-switch.min.js"></script>


    <script src="static/plugins/messenger/messenger.min.js"></script>


    <!-- FastClick -->
    <script src="static/plugins/fastclick/fastclick.js"></script>
    <!-- AdminLTE App -->
    <script src="static/dist/js/app.min.js"></script>
    <!-- DataTables -->
    {#    <script src="static/plugins/datatables/jquery.dataTables.min.js"></script>#}
    <script src="static/plugins/datatables/jquery.dataTables.min.js"></script>
    <script src="static/plugins/datatables/dataTables.bootstrap.min.js"></script>
    <script>
        Messenger.options = {
            extraClasses: 'messenger-fixed messenger-on-bottom messenger-theme-air messenger-on-right'
        }
        $('[name="mail_enable"]').bootstrapSwitch({    //初始化按钮
            onText: "开启",
            offText: "关闭",
            onColor: "success",
            offColor: "info",

            onSwitchChange: function (event, state) {
                console.log($(".email_info"));
                if (state == true) {
                    console.log("开启");
                    $(".email_info").removeAttr("disabled");

                } else {
                    $(".email_info").attr("disabled", "disabled");

                    console.log("关闭");
                }
            }
        });


        function send_email() {

            form = $("form#setting_form");
            messenger = Messenger();
            $.ajax({
                type: form.attr('method'),
                url: "/test_email",
                data: form.serialize(),
                success: function (data) {
                    var response = JSON.parse(data);
                    if (response.status == "success") {
                        messenger.post({
                            message: response.content,
                            type: "success"
                        });


                    } else if (response.status == "error")

                        messenger.post({
                            message: response.content,
                            type: "error"
                        })
                }
            });


        }


    </script>

{% endblock %}